<template>
  <v-layout class="release-container" justify-start align-start wrap>
    <v-flex md12 text-xs-left>
      <v-btn flat round @click="$router.go(-1)">
        <ui-icon icon="angle-left fa-lg"></ui-icon>
        <div class="ml-2">返回</div>
      </v-btn>
    </v-flex>
    <v-flex md6 pt-4>
      <v-layout justify-start align-center wrap px-5>
        <v-flex md12 d-flex align-center justify-start>
          <!-- 充值金额 -->
          <v-flex md4>
            <span class="subTitle title-color">注册账号</span>
          </v-flex>

          <v-flex md2>
            <span class="title title-color">{{ buyer.account }}</span>
          </v-flex>
        </v-flex>
        <v-flex md12 d-flex align-center justify-start mt-3>
          <v-flex md4>
            <span class="subTitle title-color">用户名</span>
          </v-flex>

          <v-flex md2>
            <span class="title title-color">{{buyer.nickName}}</span>
          </v-flex>
        </v-flex>

        <v-flex md12 d-flex align-center justify-space-between>
          <!-- 充值方式 -->
          <v-flex md4>
            <span class="subTitle title-color">性别</span>
          </v-flex>

          <v-flex md8>
            <v-radio-group v-model="buyer.userGender">
              <v-radio
                v-for="(item, i) in genderTypes"
                :key="i"
                :label="item.text"
                :value="item.value"
                color="primary"
              ></v-radio>
            </v-radio-group>
          </v-flex>
        </v-flex>

        <v-flex md12 d-flex align-center justify-space-between>
          <!-- 充值方式 -->
          <v-flex md4>
            <span class="subTitle title-color">状态</span>
          </v-flex>

          <v-flex md8>
            <v-select solo :items="buyerStatus" v-model="buyer.status"></v-select>
          </v-flex>
        </v-flex>

        <v-flex md12 mt-2 d-flex align-center justify-space-between>
          <!-- 交易流水号 -->
          <v-flex md4>
            <span class="subTitle title-color">买家状态说明</span>
          </v-flex>

          <v-flex md8>
            <v-textarea hide-details placeholder="如果拒绝，请填写原因" solo v-model="buyer.checkExplains"></v-textarea>
          </v-flex>
        </v-flex>

        <v-flex md12 mt-4 d-flex align-center justify-center>
          <v-flex md4>
            <v-btn large round color="primary" @click="onSave">
              <span class="title">保存</span>
            </v-btn>
          </v-flex>
        </v-flex>
      </v-layout>
    </v-flex>
  </v-layout>
</template>


<script lang="ts">
// 使用类装饰器
import { Component, Vue } from "vue-property-decorator";
import { KV } from "@/utils/type";
import { Todo, User } from "@/api";
import { CheckCommon } from "@/api/bean";
import { BuyerStatusKV, TopupStatusKV } from "@/utils/constants";
declare const $Vue: Vue;

@Component({})
export default class TopupAudit extends Vue {
  private genderTypes: Array<KV> = [
    {
      text: "男",
      value: "1"
    },
    {
      text: "女",
      value: "2"
    }
  ];

  private buyerStatus: Array<KV> = TopupStatusKV;

  private buyer: any = {};

  protected mounted() {
    // this.buyer = Object.assign({}, this.defaultBuyer);
    this.buyer = this.$route.params;
    this.getSingleUserInfo();
  }

  private onSave() {
    this.saveBuyerAudit();
  }

  /**
   * 从用户信息中查取checkType
   */
  private async getSingleUserInfo() {
    const params: any = {
      userId: this.buyer.userId,
    };
    const { data } = await User.getSingleUserInfo.r(params);
    console.log("getSingleUserInfo", data);
    if (data.result === 0) {
      this.buyer.checkType = data.data.checkType;
    } else {
      $Vue.$emit("snackbar", {
        message: data.message
      });
    }
  }
  private async saveBuyerAudit() {
    const params: CheckCommon = {
      // checkId: this.checkId,
      foreignType: this.buyer.checkType,
      checkStatus: this.buyer.status,
      checkExplains: this.buyer.checkExplains,
      foreignKeyId: this.buyer.userId
    };
    console.log(params);
    
    const { data } = await Todo.saveAudit.r(params);
    console.log("saveBuyerAudit", data);
    $Vue.$emit("snackbar", {
      message: data.message
    });
    if (data.result === 0) {
    } else {
    }
  }
}
</script>

<style lang="less" scoped>
</style>


